import { Cascader as AntCascader, CascaderProps } from 'antd'
import { CaretDownOutlined } from '@ant-design/icons'

interface DataNodeType {
  value: string | number
  label?: React.ReactNode
  disabled?: boolean
  children?: DataNodeType[]
  // 标记是否为叶子节点，设置了 `loadData` 时有效
  // 设为 `false` 时会强制标记为父节点，即使当前节点没有 children，也会显示展开图标
  isLeaf?: boolean
}

const Cascader = (props: CascaderProps<DataNodeType>) => {
  return (
    <AntCascader
      placeholder="请选择"
      showSearch
      allowClear
      suffixIcon={
        <CaretDownOutlined
          style={{ color: 'var(--xdrsec-switch-background-color)' }}
        />
      }
      getPopupContainer={triggerNode => triggerNode.parentNode}
      {...props}
    />
  )
}
export default Cascader
